<!doctype html>
<html lang="en">

	<head>
		<meta charset="UTF-8">
		<title>后台管理-WeAdmin Frame型后台管理系统-WeAdmin 1.0</title>
		<meta name="renderer" content="webkit|ie-comp|ie-stand">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
		<meta http-equiv="Cache-Control" content="no-siteapp" />
		<link rel="shortcut icon" href="./favicon.ico" type="image/x-icon" />
		<link rel="stylesheet" href="./static/css/font.css">
		<!--html这样引用完全没问题。-->
		<link rel="stylesheet" href="./static/css/weadmin.css">
		<!--这样可以吗？写一个相对位置？【而非../】【无法引入。】-->
		<!--但是这样可以？？？？【./或者？../【可以。】】-->

		<script type="text/javascript" src="./lib/layui/layui.js" charset="utf-8"></script>

	</head>

	<body>
		<div class="container"><!--顶部。-->
			<div class="logo">
				<a href="./index.html">宠物管理系统 v1.0</a><!--跳转。-->
			</div>
			<div class="left_open">
				<i title="展开左侧栏" class="iconfont">&#xe699;</i>
				<!--这什么意思？？？【一个class就好？？？为啥？【没有id调用？】】-->
			</div>
			<ul class="layui-nav left fast-add" lay-filter=""><!--？？lay-filter又是什么？？？【】-->
				<li class="layui-nav-item">
					<a href="javascript:;">+新增</a><!--点击触发JS的a标签。【好看？】-->
					<!--为啥？【外层？还是a单独？】-->
					<!--[专门展开列表？？？【】]-->
					<dl class="layui-nav-child"><!--自定义列表？？【？】-->
						<dd>
							<a onclick="WeAdminShow('资讯','https://www.youfa365.com/')">
								<i class="iconfont">&#xe6a2;</i>资讯
								<!--i是什么？？图片？？还是啥？？todo i是什么？-->
							</a>
							<!--写法，简洁。【调用那个。突出窗口。】-->
						</dd>
						<dd>
							<a onclick="WeAdminShow('图片','http://www.baidu.com')">
								<i class="iconfont">&#xe6a8;</i>图片
							</a>
						</dd>
						<dd>
							<a onclick="WeAdminShow('用户','https://www.youfa365.com/')">
								<i class="iconfont">&#xe6b8;</i>用户
							</a>
						</dd>
					</dl>
				</li>
			</ul>
			<ul class="layui-nav right" lay-filter=""><!--无序列表，右侧。（两个按的。）[class]-->

				<li class="layui-nav-item"><!--这是什么样式表？【？】-->

					<a href="javascript:;">Admin</a><!--调用了啥？【百度。】【自己写好的？？？】-->
					<!--调用，即可打开？？【怎么处罚？】-->
					<dl class="layui-nav-child"><!--这究竟是什么？？？【】-->
						<!--谁的样式？？【】-->

						<!--definition list定义表？？什么意思？不是ul？？-->
						<!--是自定义？？-->

						<!-- 二级菜单 -->
						<dd><!--什么标签？？【】-->

							<a onclick="WeAdminShow('个人信息','http://www.baidu.com')">个人信息</a>
							<!--这两个差不多。调用这个方法即可。
							【"WeAdminShow('个人信息','http://www.baidu.com')"】
							调用。-->
						</dd>
						<dd>
							<a onclick="WeAdminShow('切换帐号','./login.html')">切换帐号</a>
							<!--a还可以onclick？？？调用的那个JS？？？【admin.js里面。】-->
						</dd>
						<dd>
							<a class="loginout" href="login.html">退出</a>
							<!--退出。class样式。地址。-->
						</dd>
					</dl>
				</li>
				<li class="layui-nav-item to-index"><!--[?]-->
					<a href="/">前台首页</a>
					<!--技巧：/表示首页？就是。。。:8080即可？？【厉害了。。相对位置？】-->
					<!--没用，因为是http://localhost:63342/Github/src/main/webapp/？所以不是8080.-->
				</li>
			</ul>

		</div><!--【顶部div结束。】-->
		<!-- 顶部结束 -->
		<!-- 中部开始 -->
		<!-- 左侧菜单开始 -->
		<div class="left-nav">
			<!--左侧div【整个背景。】-->
			<div id="side-nav">
				<!--包了两层div？【有列表的那部分。】-->

				<!--谷歌显示了所有作用到的style CSS厉害。所有有关的。-->

				<ul id="nav">
					<!--里面放了一个ul。作为导航？【】-->
					<li>
						<a href="javascript:;">
							<i class="iconfont">&#xe6b8;</i>
							<cite>会员管理</cite>
							<i class="iconfont nav_right">&#xe697;</i>
							<!--调用复合CSS？？？【可以。】【这里调用，空格表示两个都适用？？【】】-->
						</a>

						<ul class="sub-menu"><!--二级菜单。【】-->
							<li>
								<a _href="./pages/member/list.html">
									<i class="iconfont">&#xe6a7;</i>
									<cite>会员列表</cite>
								</a>
							</li>
							<li>
								<a _href="./pages/member/del.html">
									<i class="iconfont">&#xe6a7;</i>
									<cite>会员删除</cite>
								</a>
							</li>
							<li><!--这个复杂？【三级？】-->
								<a href="javascript:;">
									<i class="iconfont">&#xe70b;</i>
									<cite>会员管理</cite>
									<i class="iconfont nav_right">&#xe697;</i>
								</a>
								<ul class="sub-menu"><!--无序列表？？三级菜单？【三层无序？还是啥？】-->
									<li>
										<a _href="./pages/member/addInput.html">
											<i class="iconfont">&#xe6a7;</i>
											<cite>输入框操作</cite>
										</a>
									</li>
									<li>
										<a _href="./pages/404.html">
											<i class="iconfont">&#xe6a7;</i>
											<cite>三级菜单演示</cite>
										</a>
									</li>
									<li>
										<a _href="./pages/404.html">
											<i class="iconfont">&#xe6a7;</i>
											<cite>导航菜单演示</cite>
										</a>
									</li>
								</ul>
							</li>
						</ul>
					</li>
					<li><!--无序列表的子元素。【】-->
						<a href="javascript:;"><!--【子元素，里面放a标签】（图文。多个图标。）-->
							<!--但调用JS，不调用网页。这就是区别？【如何网页放在那里面？？【】】-->
							<!--触发了什么事件？？【】-->
							<i class="iconfont">&#xe705;</i>
							<cite>文章管理</cite>
							<i class="iconfont nav_right">&#xe697;</i>
						</a>
						<ul class="sub-menu"><!--无序列表包围。-->
							<li>
								<a _href="./pages/article/list.html">
									<i class="iconfont">&#xe6a7;</i>
									<cite>文章列表</cite>
								</a>
							</li>
							<li>
								<a _href="./pages/article/category.html">
									<i class="iconfont">&#xe6a7;</i>
									<cite>分类管理</cite>
								</a>
							</li>
						</ul>
					</li>
					<li>
						<a href="javascript:;">
							<i class="iconfont">&#xe723;</i>
							<cite>订单管理</cite>
							<i class="iconfont nav_right">&#xe697;</i>
						</a>
						<ul class="sub-menu"><!--子标签里面的。不展示。-->
							<li><!--下面一个a标签，导航。-->
								<a _href="./pages/order/list.html"><!--复合型a标签。-->
									<i class="iconfont">&#xe6a7;</i><!--图-->
									<cite>订单列表</cite><!--文。-->
								</a>
							</li>
						</ul>
					</li>
					<li>
						<!--子元素。但是可以显示在无序列表中，最外层。【】-->

						<a href="javascript:;">
							<!--调用的什么？？展开和？？【展合。】-->
							<i class="iconfont">&#xe726;</i><!--图标？-->
							<cite>管理员管理</cite><!--文字？？-->
							<i class="iconfont nav_right">&#xe697;</i><!--图标？-->
						</a>
						<ul class="sub-menu">
							<!--子标签，默认不显示。【display: none;】-->

							<!--子标签页？？？【子标签页都这么多内容？？（图标，超链接。）】-->
							<li>
								<a _href="./pages/admin/list.html">
									<i class="iconfont">&#xe6a7;</i>
									<cite>管理员列表</cite>
								</a>
							</li>
							<li>
								<a _href="./pages/admin/role.html">
									<i class="iconfont">&#xe6a7;</i>
									<cite>角色管理</cite>
								</a>
							</li>
							<li>
								<a _href="./pages/admin/cate.html">
									<i class="iconfont">&#xe6a7;</i>
									<cite>权限分类</cite>
								</a>
							</li>
							<li>
								<a _href="./pages/admin/rule.html"><!--网页资源。【收集。】-->
									<i class="iconfont">&#xe6a7;</i><!--图标资源。【收集。】-->
									<cite>权限管理</cite>
								</a>
							</li>
						</ul>
					</li>
					<li>
						<a href="javascript:;">
							<!--这个是调用JS的。这个标签的内容？？？【以及需要展开下面的。】-->
							<!--怎么调用的？？？【？？】-->
							<!--是a标签。-->

							<i class="iconfont">&#xe6ce;</i><!--图标？【？？】-->
							<cite>系统统计</cite><!--文字。-->
							<i class="iconfont nav_right">&#xe697;</i><!--图标？【？？】-->
						</a>

						<ul class="sub-menu">
							<!--li里面嵌套放了一个ul无序列表。无序列表的嵌套。-->
							<li>
								<a _href="./pages/echarts/echarts1.html"><!--跳到新页面？
								【即可。看这些页面怎么写的即可。】-->
									<!--全放的a标签，用来转？跳转？即可？【】-->
									<i class="iconfont">&#xe6a7;</i>
									<!--图标（导入一个文字的文字？？？）得有。【导入？？？】-->
									<!--使用这个字体CSS，即可。-->
									<cite>拆线图</cite><!--文字。【？？】-->
								</a>
							</li>
						</ul>
					</li>
				</ul>
			</div>
		</div><!--左侧div结束。-->
		<!-- <div class="x-slide_left"></div> -->
		<div class="page-content">
			<!--内容区。-->
			<div class="layui-tab tab" lay-filter="wenav_tab" id="WeTabTip" lay-allowclose="true">
				<!--整个？【】-->
				<ul class="layui-tab-title" id="tabName">
					<!--【】管他的，反正可以自动生成。点击左边按钮即可。【虽然不知道为什么？？】【待会儿看左边按钮的单击事件。JS？】-->

					<!--【id可以被操作。】-->
					<!--这是标签栏？【有id可以被JS操控。】难道是因为class的原因？？-->
					<!--明明没有-->
					<li>我的桌面</li>
					<!--<i class="layui-icon layui-unselect layui-tab-close">ဆ</i>【关闭按钮。】-->
					<!--这里明明没有那个啊。【？？？？】【这个应该在li里面的？？】-->
					<!--ul是什么？无序列表？li是什么？元素？【。】-->


					<!--【一个标签。】<li lay-id="10"【有id】 class="layui-this" data-bit="1"【这是什么？】>分类管理【文字。】
					<i class="layui-icon layui-unselect layui-tab-close">ဆ</i>【关闭按钮。】
					</li>-->
					<!--当前显示有::after这个东西。看CSS？【.layui-tab-title .layui-this:after {】-->
				</ul>
				<div class="layui-tab-content"><!--这就是内容区域了。-->
					<div class="layui-tab-item layui-show"><!--多个div，可以相互切换样式，
					layui-tab-item layui-show和layui-tab-item两者切换。-->
						<!--这个【div就是用的layui.css里面的？也就是多层跨界调用？【】】-->
						<iframe src='./pages/welcome.html' frameborder="0" scrolling="yes" class="weIframe"></iframe>
						<!--div里面放了一个其他页面。新页面？【】-->
					</div>
					<!--其他iframe貌似有tab-id。
					此外，src不同，其他都相同。-->
				</div>
			</div>
		</div>



		<div class="page-content-bg">wowoowoow</div>
		<!--有了，貌似是背景图。在右侧页面区的，看style才知道。【谷歌，实时调控CSS，还有编辑html代码。都可以。】-->

		<!--这个没有看到？？？？？-->

		<!-- 右侧主体结束 -->
		<!-- 中部结束 -->
		<!-- 底部开始 -->
		<div class="footer">
			<!--底部footer的div【ok】-->
			<div class="copyright">Copyright ©2019 宠物管理系统 v1.0 All Rights Reserved</div>
			<!--class格式。-->
		</div><!--底部结束。-->

		<!--js代码开始？？？【是干嘛的？？？？】【JS调用JS？】-->
		<script type="text/javascript">
			/*JS就调用了其他的函数【layui.js=虽然不知道是什么用？？？】*/

//			layui扩展模块的两种加载方式-示例
//		    layui.extend({
//			  admin: '{/}../../static/js/admin' // {/}的意思即代表采用自有路径，即不跟随 base 路径
//			});
//			//使用拓展模块
//			layui.use('admin', function(){
//			  var admin = layui.admin;
//			});


			layui.config({
			  base: './static/js/'
			  ,version: '101100'
			}).use('admin');
			/*底层解析？？？【】*/

			/*这里传入的参数是ajax？？？？【】*/
			/*调用use函数？【】*/

			/*这是什么东西？？todo 测试一下？？？*/

			layui.use(['jquery','admin'], function(){
				var $ = layui.jquery;
				$(function(){
					var login = JSON.parse(localStorage.getItem("login"));
					if(login){
						if(login=0){
							window.location.href='./login.html';
							return false;
						}else{
							return false;
						}
					}else{
						window.location.href='./login.html';
						return false;
					}
				});
			});
			/*这个函数究竟什么用？？？【底层JS？？？或者解析？？？（）】*/

		</script>
	</body>
	<!--Tab菜单右键弹出菜单-->

	<!--【右键菜单开始。（ok）【】】【这个写在body的外面。而且是在html的里面。】-->
	<ul class="rightMenu" id="rightMenu">
		<!--怎么看它 调用的？？？没看出来啊？？？【】-->
        <li data-type="fresh">刷新</li>
		<!--这个是什么意思？？？？【data-type是什么？？？】-->
		<!--todo 调用的什么？？？-->

        <li data-type="current">关闭当前</li>
        <li data-type="other">关闭其它</li>
        <li data-type="all">关闭所有</li>
    </ul>

</html>